<template>
    <div>
      <el-dialog
        :visible.sync="exportDialog"
        width="580px"
        append-to-body
        @close="closeDia"
        center
        style="font-size: 13px">
        <span slot="title" class="dialog-title">订单导出</span>
        <el-row :gutter="20">
          <el-col :span="12"><div class="export_item">
            <p style="text-align: center">中文模板</p>
            <div class="export_box">
              <viewer><img  style="width: 72px" :src="cnPic"/></viewer>
              <div>
                <p>
                  <svg class="icon" aria-hidden="true" style="font-size: 28px;vertical-align: middle">
                    <use xlink:href="#icon-xls"></use>
                  </svg>
                  <span class="template_text" @click="down('excel', 'cn')">下载</span>
                  <span class="template_text" @click="send('excel', 'cn')">发送</span>
                </p>
                <p>
                  <svg class="icon" aria-hidden="true" style="font-size: 28px;vertical-align: middle">
                    <use xlink:href="#icon-pdf"></use>
                  </svg>
                  <span class="template_text" @click="down('pdf', 'cn')">下载</span>
                  <span class="template_text" @click="send('pdf', 'cn')">发送</span>
                </p>
              </div>
            </div>
          </div></el-col>
          <el-col :span="12"><div class="export_item">
            <p style="text-align: center">英文模板</p>
            <div class="export_box">
              <viewer><img  style="width: 72px" :src="enPic"/></viewer>
              <div>
                <p>
                  <svg class="icon" aria-hidden="true" style="font-size: 28px;vertical-align: middle">
                    <use xlink:href="#icon-xls"></use>
                  </svg>
                  <span class="template_text" @click="down('excel', 'en')">下载</span>
                  <span class="template_text" @click="send('excel', 'en')">发送</span>
                </p>
                <p>
                  <svg class="icon" aria-hidden="true" style="font-size: 28px;vertical-align: middle">
                    <use xlink:href="#icon-pdf"></use>
                  </svg>
                  <span class="template_text" @click="down('pdf', 'en')">下载</span>
                  <span class="template_text" @click="send('pdf', 'en')">发送</span>
                </p>
              </div>
            </div>
          </div></el-col>
        </el-row>
        <span slot="footer" class="dialog-footer">
        <el-button @click="closeDia" size="small">取 消</el-button>
        <el-button type="primary" @click="closeDia" size="small">确 定</el-button>
      </span>
      </el-dialog>
    </div>
</template>

<script>
    import {exportExcel, pdfExport} from '@/api/order'
    import {nowDate} from '@/util/util'
    import axios from '@/router/axios';
    import {getToken} from '@/util/auth'
    import website from '@/config/website';
    import {Base64} from 'js-base64';
    export default {
        name: "export",
        props:['excelId', 'visible'],
          data() {
              return {
                  cnPic:'./img/cn_abbreviation.png',
                  enPic:'./img/en_abbreviation.png',
                  exportDialog: true,

              }
          },
        mounted() {
            this.exportDialog = this.visible
        },
        methods: {
            closeDia() {
              this.$emit('close')
            },
            down(sizeType, type) {
                if(sizeType == 'excel') {

                    if (type == 'cn') {
                        exportExcel(this.excelId, 1).then(res => {
                            // if(res.data.success) {
                            var blob = new Blob([res.data], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'}); // application/vnd.openxmlformats-officedocument.spreadsheetml.sheet这里表示xlsx类型
                            var downloadElement = document.createElement('a');
                            var href = window.URL.createObjectURL(blob); // 创建下载的链接
                            downloadElement.href = href;

                            downloadElement.download = nowDate('cn', 'xlsx'); // 下载后文件名
                            document.body.appendChild(downloadElement);
                            downloadElement.click(); // 点击下载
                            document.body.removeChild(downloadElement); // 下载完成移除元素
                            window.URL.revokeObjectURL(href); // 释放掉blob对象
                            // }
                        })
                    } else {
                        exportExcel(this.excelId, 2).then(res => {
                            // if(res.data.success) {
                            var blob = new Blob([res.data], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'}); // application/vnd.openxmlformats-officedocument.spreadsheetml.sheet这里表示xlsx类型
                            var downloadElement = document.createElement('a');
                            var href = window.URL.createObjectURL(blob); // 创建下载的链接
                            downloadElement.href = href;

                            downloadElement.download = nowDate('en', 'xlsx'); // 下载后文件名

                            document.body.appendChild(downloadElement);
                            downloadElement.click(); // 点击下载
                            document.body.removeChild(downloadElement); // 下载完成移除元素
                            window.URL.revokeObjectURL(href); // 释放掉blob对象
                            // }
                        })
                    }
                } else {
                    if (type == 'cn') {
                        pdfExport(this.excelId, 1).then(res => {
                            // if(res.data.success) {
                            var blob = new Blob([res.data], {type: 'pdf;charset=utf-8'}); // pdf类型
                            console.log(blob)
                            var downloadElement = document.createElement('a');
                            var href = window.URL.createObjectURL(blob); // 创建下载的链接
                            downloadElement.href = href;

                            downloadElement.download = nowDate('cn', 'pdf'); // 下载后文件名

                            document.body.appendChild(downloadElement);
                            downloadElement.click(); // 点击下载
                            document.body.removeChild(downloadElement); // 下载完成移除元素
                            window.URL.revokeObjectURL(href); // 释放掉blob对象
                            // }
                        })
                    } else {
                        pdfExport(this.excelId, 2).then(res => {
                            // if (res.data.success) {
                            var blob = new Blob([res.data], {type: 'pdf;charset=utf-8'}); // pdf类型
                            var downloadElement = document.createElement('a');
                            var href = window.URL.createObjectURL(blob); // 创建下载的链接
                            downloadElement.href = href;

                            downloadElement.download = nowDate('en', 'pdf'); // 下载后文件名

                            document.body.appendChild(downloadElement);
                            downloadElement.click(); // 点击下载
                            document.body.removeChild(downloadElement); // 下载完成移除元素
                            window.URL.revokeObjectURL(href); // 释放掉blob对象
                            // }
                        })
                    }
                }
            },
            send(sizeType, type) {
                if(sizeType == 'excel') {

                    if (type == 'cn') {
                        exportExcel(this.excelId, 1).then(res => {
                            var blob = new Blob([res.data], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'}); // application/vnd.openxmlformats-officedocument.spreadsheetml.sheet这里表示xlsx类型

                            let files = new window.File([blob], '中文模板.xlsx', {type: 'xlsx'})
                            var fd = new FormData();
                            fd.append('file', files)
                            axios({
                                url: '/api/blade-file/file/upload',
                                method: 'post',
                                headers: {
                                    "Content-Type": "multipart/form-data",
                                    "Authorization": `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`,
                                    "Blade-Auth" : 'bearer ' + getToken()
                                },
                                data: fd
                            }).then((res) => {
                                this.dealEnd(res)
                            }).catch(err => {
                                console.log(err)
                            })
                        })
                    } else {
                        exportExcel(this.excelId, 2).then(res => {
                            var blob = new Blob([res.data], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'}); // application/vnd.openxmlformats-officedocument.spreadsheetml.sheet这里表示xlsx类型
                            let files = new window.File([blob], '英文模板.xlsx', {type: 'xlsx'})
                            var fd = new FormData();
                            fd.append('file', files)
                            axios({
                                url: '/api/blade-file/file/upload',
                                method: 'post',
                                headers: {
                                    "Content-Type": "multipart/form-data",
                                    "Authorization": `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`,
                                    "Blade-Auth" : 'bearer ' + getToken()
                                },
                                data: fd
                            }).then((res) => {
                                this.dealEnd(res)
                            }).catch(err => {
                                console.log(err)
                            })
                        })
                    }
                } else {
                    if (type == 'cn') {
                        pdfExport(this.excelId, 1).then(res => {
                            var blob = new Blob([res.data], {type: 'pdf;charset=utf-8'}); // pdf类型

                            let files = new window.File([blob], '中文模板.pdf', {type: 'pdf'})
                            var fd = new FormData();
                            fd.append('file', files)
                            axios({
                                url: '/api/blade-file/file/upload',
                                method: 'post',
                                headers: {
                                    "Content-Type": "multipart/form-data",
                                    "Authorization": `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`,
                                    "Blade-Auth" : 'bearer ' + getToken()
                                },
                                data: fd
                            }).then((res) => {
                                this.dealEnd(res)
                            }).catch(err => {
                                console.log(err)
                            })
                        })
                    } else {
                        pdfExport(this.excelId, 2).then(res => {
                            // if (res.data.success) {
                            var blob = new Blob([res.data], {type: 'pdf;charset=utf-8'}); // pdf类型
                            let files = new window.File([blob], '英文模板.pdf', {type: 'pdf'})
                            var fd = new FormData();
                            fd.append('file', files)
                            axios({
                                url: '/api/blade-file/file/upload',
                                method: 'post',
                                headers: {
                                    "Content-Type": "multipart/form-data",
                                    "Authorization": `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`,
                                    "Blade-Auth" : 'bearer ' + getToken()
                                },
                                data: fd
                            }).then((res) => {
                                this.dealEnd(res)
                            }).catch(err => {
                                console.log(err)
                            })
                        })
                    }
                }
            },
            dealEnd(res){
                if(res.data.success){
                    let result = res.data.data[0];
                    let param ={
                        picName:result.fileName,
                        fileGuid:result.fileUrl,
                        fileSize:result.fileSize
                    }
                    this.$router.push({
                        path: '/mail/write/index',
                        query:{
                            file:param
                        }
                    })
                }
            }
        }
    }
</script>

<style scoped lang="scss">
  .export_item{
    background-color: #f5f5f5;
    border-radius: 10px;
    padding: 10px;
    box-sizing: border-box;
  }
  .export_box{
    display: flex;
    align-items: center;
    justify-content: space-around;
  }
  .template_text{
    margin: 0 5px;
    color: #2A97F9;
    text-decoration: underline;
    cursor: pointer;
  }
</style>
